<style scoped>
</style>
<template>
  <div class="mui-content books-list-content" id="content">

    <ul class="mui-table-view">
      <li class="mui-table-view-cell" v-for="subject in subjects">
        <a class="mui-navigate-right" @click.prevent.stop="goToDetail(subject.id)">{{subject.title}}</a>
      </li>
    </ul>


  </div>
</template>
<script>

  import api from '@/fetch/api';

  export default {
    data () {
      return {
        subjects:{},
      }
    },
    methods:{
      handle: function(e, str){
        e.target.innerHTML += ("  " + str);
      },
      goToDetail(id){
        this.$router.push({path: `/detail/${id}`});
      },
      onSwipeLeft(){
        console.log('222');
      }
    },
    mounted(){
      let $this = this;
      let params = {};
      $this.$emit('showLoading');
      api.fetchPost(api.path.in_theaters, params).then((data) => {
        //console.log(JSON.stringify(data));
        $this.$emit('hideLoading');
        $this.subjects = data.subjects;
      }).catch(err => {
        $this.$emit('hideLoading');
        console.log(JSON.stringify(err));
      })
    }
  }

</script>
